<template>
	<view class="">
		<view v-for="(item, index) in list" :key="index" class="card mb-1 position-relative"
			style="width:708rpx;height:250rpx;" :class="{ even: index % 2 != 0 }"
			@click="toDetail(item.class_code, index, item.class_id,item.master_user_id)">
			<image src="../../static/img/ic_home_class_item_one.png" style="width:708rpx;height:250rpx;"
				v-if="index % 2 == 0" class="position-absolute" mode=""></image>
			<image src="../../static/img/ic_home_class_item_two.png" style="width:708rpx;height:250rpx;" v-else
				class="position-absolute" mode=""></image>
			<view class="flex-column position-absolute" style="padding:30rpx 40rpx 30rpx 40rpx;width: 598rpx;">
				<view class="flex">
					<image :src="item.class_pic" style="width:110rpx;height:110rpx;border-radius:10rpx;"
						v-if="item.class_pic" mode=""></image>
					<image src="../../static/img/ic_default_head.png"
						style="width:110rpx;height:110rpx;border-radius:10rpx;" v-else mode=""></image>
					<view class="flex-colum flex-1" style="margin-left: 17rpx;">
						<!-- <view class="font36 colorfff font-weight-500 overflow-hidden"
							style="line-height:1.2;margin-bottom: 20rpx;">
							{{ item.master_user_name }}
						</view>
						<view class="flex">
							<view class="colorfff font26 fontbold mr-3">人数:{{ item.student_count }}</view>
							<view class="colorfff font26 fontbold">人数 :{{ item.student_count }}</view>
						</view> -->
						<view class="colorfff font26 fontbold">学校：{{ item.school }}</view>
						<view class="colorfff font26 fontbold">年级：{{ item.class_njname }}</view>
						<view class="colorfff font26 fontbold">班级：{{ item.class_name }}</view>
						<view class="flex align-center justify-between">
							<view class="colorfff font26 fontbold">班主任：{{ item.master_user_name }}</view>
							<view class="colorfff font26 fontbold">人数 :{{ item.student_count }}</view>
						</view>
					</view>
				</view>
			<!-- 	<view class="flex justify-between">
					<view class="colorfff font22 font-weight-500 line-h mt-3">班级:{{ item.class_name }}</view> -->
					<!-- <view class="classDetail font20 colorfff align-center text-center mr-2" @click.stop="wendu(item.user_id)"><view class="">查看温度</view></view> -->
					<!-- <view class="classDetail font20 colorfff align-center text-center">
						<view class="">班级详情</view>
					</view>
				</view> -->
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {};
		},
		props: {
			list: {
				type: Array,
				default: []
			}
		},
		methods: {
			toDetail(id, index, classId,masterId) {
				uni.navigateTo({
					url: '../teachDetail/teachDetail?id=' + id + '&index=' + index + '&classId=' + classId+ '&masterId=' + masterId
				});
			},
			wendu(data) {
				uni.navigateTo({
					url: '../../pages/class/temperature/temperature?id=' + data
				});
			}
		}
	};
</script>

<style>
	/* .card {
	height: 320rpx;
	background-image: url(../../static/img/ic_home_class_item_one.png);
	background-size: 708rpx 320rpx;
}
.card.even {
	background-image: url(../../static/img/ic_home_class_item_two.png);
} */
	.card .classDetail {
		width: 180rpx;
		height: 50rpx;
		background: rgba(241, 127, 34, 1);
		border-radius: 30rpx;
	}

	.card.even .classDetail {
		width: 180rpx;
		height: 50rpx;
		background: rgba(99, 147, 244, 1);
		border-radius: 30rpx;
	}

	.card .hoverButton {
		background: rgba(241, 127, 34, 0.4);
	}

	.card.even .hoverButton {
		background: rgba(99, 147, 244, 0.4);
	}
</style>
